@charset "utf-8";

/* 右边主要内容区 */
.main-content{
    width:80%;
    height:1600px;
}
.banner .opacity ul li a:hover,
.banner .opacity ul li a.active{
     background-color: #279AAA;
     color:white;
}

.search h3,.recent-blog h3{
    font-weight:bold;
    letter-spacing:2px;
    color:transparent;
     background:linear-gradient(to right,red 1%,orange 4%,yellow 3%,skyblue 10%,white 15%);
     -webkit-background-clip:text;
}
/* recent blog部分*/
.recent-blog{
   margin:10% 0 18% 3%;
    
}
.recent-blog li{
    
    float:left;
    width:24.25%;
    background-color:white;
    
}
.recent-blog li+li{
    margin:0 0 1% 1%;
}
.recent-blog ul li:nth-child(5),
.recent-blog ul li:nth-child(9){
    margin-left:0;
}
.recent-blog .text{
    width:calc(100% - 40px);
    padding:20px;
    background-color:white;
}
.recent-blog  li > a{
    overflow:hidden;
    display:block;
    width:100%;
    /* height:184px; */

    
}
.recent-blog a > img{
    width:100%;
    /* height:184px; */
    transform:scale(1.3);
    transition:1s;
   
}
.recent-blog li:hover img{
    transform:scale(1);
}


.recent-blog li h4,.recent-blog li em,
.recent-blog .text > a,
.touch a{
    text-transform:uppercase;
}
.recent-blog li em{
    color:rgba(0, 0, 0, 0.4);
    font-size:70%;
}
.recent-blog li p{
    margin:20px 0 20px 0 ;
    color:rgba(0, 0, 0, 0.5);
    font-weight:300;
    line-height:1.6;
}
.recent-blog .text > a{
    font-size:11px;
    letter-spacing:2px;
    color:#000;
}
.recent-blog .text > a i{
    vertical-align: middle;
}
/* touch 部分 */
.touch{
    width:97%;
    margin-left:3%;
}
.touch h3{
    background:linear-gradient(to right,red 5%,orange 15%,yellow 50%,skyblue 70%);
    -webkit-background-clip:text;
    color:transparent;
    font-size:30px;
}

.touch p{
    width:55%;
    color:rgba(0, 0, 0, 0.5);
}
.touch a{
    padding:10px;
    background-color:skyblue;
    color:#fff;
    letter-spacing:1px;
}
